<template>
  <el-dialog v-if="load" :close-on-click-modal="false" title="估算日销量" v-model="visible" append-to-body width="800px"
    :z-index="2000" @close="handleClose">
    <div class="grid grid-cols-3 gap-x-3 my-3">
      <div v-for="(d, i) in form.rule" :key="i">{{ d.start }}-{{ d.end }}天销量: {{ d.sale_num }}</div>
    </div>
    <el-form label-position="top">
      <el-form-item label="系统预估日均销量">
        [
        <span v-for="(d, i) in form.rule" :key="i">
          <span v-if="i" class="mx-1">+</span>
          ({{ d.start }}-{{ d.end }})天销量/{{ d.day }}*{{ d.percent }}%
        </span>
        ] * {{ form.sale_ratio }} = {{ form.estimate_sale_num }}
      </el-form-item>
    </el-form>
    <el-alert title="备注" type="info" show-icon :closable="false">
      订单系统的销量统计和【智能备货参数设置】中维护的计算公式，每天定时计算系统预估日均销量
    </el-alert>
    <template #footer>
      <el-button @click="close">关 闭</el-button>
    </template>
  </el-dialog>
</template>

<script setup>
const api = inject('api')
const load = ref(false)
const visible = ref(false)
const form = ref({})
const type = inject('type')

const emit = defineEmits(['close', 'success'])

// 打开弹窗
const open = async (is_id) => {
  if (!load.value) {
    load.value = true
    await 1
  }
  const res = await api.estimateDaySale({ is_id, type })
  form.value = res.data
  visible.value = true
}
// 关闭弹窗
const close = () => {
  visible.value = false
}

const handleClose = () => {
  emit('close')
}

defineExpose({ open })
</script>